<template>
    <div id="ccui-paging">
        <el-pagination
            :total="page.totalNum"
            :page-size="page.pageSizeCode"
            :current-page="page.pageNoCode"
            :page-sizes="page.pageSizes"
            background
            layout="total, sizes, prev, pager, next, jumper"
            popper-class="ccui-paging-page-size-popper"
            @size-change="val => {handlePageChange(val,'sizeChange')}"
            @current-change="val => {handlePageChange(val,'currentChange')}"
        />
        <el-button
            class="ccui-pagination-btn"
            size="mini"
            type="default"
        >确定
        </el-button>
    </div>
</template>

<script>
export default {
    name: "Pagination",
    props: {
        page: {
            type: Object,
            default: () => {
                return {};
            }
        }
    },
    methods: {
        handlePageChange(val, type) {
            this.$emit("handlePageChange", val, type);
        }
    }
}
</script>

<style scoped>

</style>